<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>节点控制</title>
  <script type="module" src="./preview.js"></script>
  <script type="module" src="./logic.js"></script>
</head>

<body>
  <h1>相机预览</h1>
  <canvas width="640" height="480" id="imgPreview"></canvas>
  <h1>设备状态</h1>
  <p>相机数量 : <span id="labCameraNum"></span></p>
  <p>相机列表</p>
  <table>
    <thead>
      <tr>
        <th>UUID</th>
      </tr>
    </thead>
    <tbody id="listCamera">
      <tr>
        <td>456</td>
      </tr>
      <tr>
        <td>456</td>
      </tr>
    </tbody>
  </table>
  <p>拍摄状态: <span id="labShotStatus"></span></p>
  <h1>控制面板</h1>
  <p>
    选择需要设置的相机 :
    <select id="selectCamera">
      <option value=0>test</option>
      <option value=1>test1</option>
    </select>
  </p>
  <button id="btnCameraPriview">播放预览视频</button>
  <button id="btnRefreshCameraList">刷新相机列表</button>
  <button id="btnRefreshShotStatus">刷新拍摄状态</button>
  <button id="btnStartShot">开始拍摄</button>
  <button id="btnStopShot">停止拍摄</button>
  <button id="btnGetSettingList">获取设置列表</button>
  <button id="btnGetSettingValue">获取设置内容</button>
  <br>
  <h2>相机设置</h2>
  <form id="formSettingList">
    <label>图像宽度</label>
    <input type="number" id="settingItem_1" onchange="change_SettingItem(1)" required>
    <br>
  </form>
  <h1>状态消息</h1>
  <p id="labLogInfo"></p>
</body>

</html>
